<template>
<div>
    <Row>
        <Col span="12">col-12</Col>
        <Col span="12">col-12</Col>
    </Row>
    <br>
    <Row>
        <Col :xs="24" :sm="12" :md="6">Col</Col>
        <Col :xs="24" :sm="12" :md="6">Col</Col>
        <Col :xs="24" :sm="12" :md="6">Col</Col>
    </Row>

    <Row style="background:#eee;padding:20px">
        <Col span="11">
            <Card :bordered="false">
                <p slot="title">Borderless card</p>
                <p>Content of card</p>
                <p>Content of card</p>
                <p>Content of card</p>
            </Card>
        </Col>
        <Col span="11" offset="2">
            <Card shadow>
                <p slot="title">Use a card with a shadow effect</p>
                <p>Content of card</p>
                <p>Content of card</p>
                <p>Content of card</p>
            </Card>
        </Col>
    </Row>
    
    <!-- 左右布局 -->
    <div class="demo-split">
        <Split>
            <div slot="left" class="demo-split-pane">
                Left Pane
            </div>
            <div slot="right" class="demo-split-pane">
                Right Pane
            </div>
        </Split>
    </div>
</div>
</template>
<script>
    export default {
         name: 'CommonGrid',
          data () {
            return {
            }
        },
        methods: {
        }
    }
</script>
